<template>
  <div class="content">
    <div class="breadcrumb" :gutter="24">
      {{$t('menu.production_scheduling')}}

    </div>
    <el-form ref="form" :model="formData" label-width="70px" size="small">
      <el-row :gutter="28">
        <el-col :xs="3" :sm="1" :md="1" :lg="1" :xl="1">
          <el-button type="primary" size="small" :icon="'iconfont ' + icon" class="change" @click="changePattern"></el-button>
        </el-col>
        <el-col :xs="9" :sm="6" :md="5" :lg="3" :xl="3">
          <el-form-item :label="$t('common.keyword')">
            <el-input v-model="formData.keyword" clearable placeholder=""></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="12" :sm="8" :md="10" :lg="7" :xl="5" class="titmepicker">
          <el-form-item :label="$t('common.create_time')">
            <el-date-picker v-model="formData.time" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
              :unlink-panels="true">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :xs="9" :sm="6" :md="5" :lg="4" :xl="4">
          <el-form-item :label="$t('recipe.state')" label-width="40px">
            <el-select v-model="formData.status" multiple placeholder="" clearable>
              <el-option v-for="(item,index) in statusList" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :xs="2" :sm="2" :md="2" :lg="2" :xl="2">
          <el-form-item label-width="0px">
            <el-button type="primary" size="small" @click="handleSearch">{{ $t("common.query") }}</el-button>
          </el-form-item>
        </el-col>

        <div class="btngroup">
          <el-button type="primary" size="small" @click="handleAdd()">{{ $t("common.add") }}</el-button>
          <el-button type="primary" size="small" :disabled="disabled != 0" @click="modifyRow()">{{ $t("common.edit") }}</el-button>
          <el-button type="primary" size="small" :disabled="disabled != 0" @click="handleDelete()">{{ $t("common.remove") }}</el-button>
          <el-button type="primary" size="small" :disabled=" disabled != 0 || currObj.isPlanned == 1"
            @click="handleIssueRecall(1)">{{ $t("workorder.download") }}</el-button>
          <el-button type="primary" size="small" :disabled="disabled != 1"
            @click="handleIssueRecall(0)">{{ $t("workorder.revoke") }}</el-button>
        </div>
      </el-row>
    </el-form>
    <div class="dataContent">
      <tableList :tableData="tableData" :pager="pager" v-if="!isCard" :tableLoading="tableLoading" @handleEdit="handleEdit"
        @sortChange="sortChange"></tableList>
      <cardList @handleEdit="handleEdit" v-if="isCard" :tableData="tableData" :tableLoading="tableLoading"></cardList>
      <div class="pagination-area">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="[20, 30, 50, 100]"
          :page-size="pager.pageSize" :current-page="pager.pageNum" layout="total, sizes, prev, pager, next, jumper" :total="pager.total">
        </el-pagination>
      </div>
      <div class="marginLing">
        <el-row :gutter="24">
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <div style="text-align: right;padding-right:10px">
              <el-button size="mini" type="text" @click="exportpic('columnar','柱状图')">{{$t('common.export_bar')}}</el-button>
            </div>
            <div id="columnar" ref="columnar" style="height: 350px;" v-loading="echartsLoading"></div>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
            <div style="text-align: right;padding-right:10px">
              <el-button size="mini" type="text" @click="exportpic('annular','饼图')">{{$t('common.export_pie')}}</el-button>
            </div>
            <div id="annular" ref="annular" style="height: 350px;" v-loading="echartsLoading"></div>
          </el-col>
        </el-row>
      </div>
    </div>

    <el-dialog v-dialogDrag :title="title" :visible.sync="isShowDialog" :close-on-click-modal="false" width="60vh" class="isShowDialog"
      :before-close="handleClose">
      <el-form :model="ruleForm" label-width="80px" ref="ruleForm" size="small" :rules="rules" :hide-required-asterisk="true">
        <el-row :gutter="35">
          <el-col :xs="24">
            <!-- <el-form-item :label="$t('workorder.work_order_number')" prop="woId"> -->
            <el-form-item :label="$t('workorder.work_order_number')" prop="woId">
              <el-input v-model="ruleForm.woId" :disabled="title == '编辑'" placeholder="" @input="workOrderJudge" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item :label="$t('recipe.formula_name')" prop="recipeId">
              <el-select v-model="ruleForm.recipeId" remote filterable :remote-method="remoteMethod" placeholder=""
                v-el-select-loadmore="loadMoreFun" clearable @change="changeRecipeId">
                <el-option v-for="(item,index) in formulaDstList" :key="index" :label="item.recipeName" :value="item.fid"></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :xs="24">
            <el-form-item :label="$t('common.version')" prop="version">
              <el-select v-model="ruleForm.version1" @change="changeVersion">
                <el-option v-for="(item,index) in versionList" :key="index" :label="item.version" :value="item.version"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item :label="$t('workorder.batch_number')" prop="lotNum">
              <el-input v-model="ruleForm.lotNum" placeholder="" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item :label="$t('workorder.order_number')" prop="poNum">
              <el-input v-model="ruleForm.poNum" placeholder="" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item :label="$t('dialog.plan_time')" prop="planTime">
              <el-date-picker v-model="ruleForm.planTime" type="datetimerange" range-separator="至" start-placeholder="开始日期"
                end-placeholder="结束日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item :label="$t('recipe.material_code')" prop="item">
              <el-input disabled v-model="ruleForm.item" placeholder="" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item :label="$t('dialog.numbers')" prop="itemQty">
              <el-input disabled v-model="ruleForm.itemQty" placeholder="" min="0" v-enterNumber2 type="number" clearable>
                <template slot="append">{{ruleForm.uomId}}</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item :label="$t('workorder.work_order_type')">
              <el-select v-model="ruleForm.type" disabled placeholder="">
                <el-option :label="$t('dialog.produce_batch')" value="1"></el-option>
                <el-option :label="$t('dialog.experiment_batch')" value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" size="small" @click="handleAddFormula('ruleForm')"
          :loading="loading">{{ $t("common.preservation") }}</el-button>
        <el-button @click="handleClose()" size="small">{{ $t("common.cancel") }}</el-button>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import { scheduling } from "@/api/scheduling"
import tableList from "./template/tableList.vue"
import cardList from "./template/cardList.vue"
import { columnarEcharts, annularEchar } from "./echarts.js"
import { approvehttp } from "@/api/approve"
export default {
  components: {
    tableList,
    cardList
  },
  data () {
    let woIdFn = (rule, value, callback) => {
      if (this.title == "新增" && value) {
        scheduling.workOrderCheck({ woId: value }).then(res => {
          console.log(res)
          if (res.code == 200) {
            callback();
          } else {
            callback(new Error('工单号不能重复'));
          }
        }).catch(e => {
          callback(new Error('工单号不能重复'));
        })
      } else if (!value) {
        callback(new Error('工单号不能为空'));
      } else {
        callback();
      }
    }
    let lotNumFn = (rule, value, callback) => {
      if (this.title == "新增" && value) {
        scheduling.checkLot({ lotNum: value }).then(res => {
          if (res.code == 200) {
            callback();
          } else {
            callback(new Error('批次号已存在'));
          }
        })
      } else if (this.title == "编辑" && value) {
        scheduling.checkLot({ lotNum: value, woId: this.ruleForm.woId }).then(res => {
          if (res.code == 200) {
            callback();
          } else {
            callback(new Error('批次号已存在'));
          }
        })
      }
    }
    return {
      formData: {
        keyword: "",
        time: [],
        status: ['0', '1', '2', '4']
      },
      ruleForm: {
        recipeId: "",
        woId: "",
        lotNum: "",
        poNum: "",
        planTime: [],
        itemQty: "",
        uomId: "",
        type: "",
        version: "",
        version1: "",
      },
      pager: {
        pageNum: 1,
        pageSize: 20,
        total: 0,
        field: 'creatTimeLocal',
        order: 'DESC',
      },
      formulaPage: {
        pageNum: 1,
        pageSize: 20,
      },
      keyword: "",
      formulaList: [],
      formulaDstList: [],
      recipeName: '',
      recipeId: '',
      versionList: [],
      tableData: [],
      icon: "icon-biaoge",
      isShowDialog: false,
      loading: false,
      selectLoading: false,
      tableLoading: false,
      title: "新增",
      rules: {
        recipeId: [{ required: true, message: '配方名称不能为空', trigger: 'change' }],
        woId: [
          { required: true, message: '工单号不能为空', trigger: 'blur' },
          { validator: woIdFn, trigger: 'blur' }
        ],
        // version: [{ required: true, message: '版本不能为空', trigger: 'blur' },
        // ],
        lotNum: [
          { required: true, message: '批次号不能为空', trigger: 'blur' },
          { validator: lotNumFn, trigger: 'blur' }
        ],
      },
      secle: "",
      isCard: false,
      disabled: -1,
      statusList: [
        {
          label: this.$t('workorder.newly_build'),
          value: "0"
        }, {
          label: this.$t('workorder.release'),
          value: "1"
        }, {
          label: this.$t('workorder.function'),
          value: "2"
        }, {
          label: "生产结束",
          value: "3"
        }, {
          label: this.$t('workorder.suspend'),
          value: "4"
        }, {
          label: this.$t('common.abandoned'),
          value: "5"
        }, {
          label: this.$t('common.examine'),
          value: "7"
        }, {
          label: this.$t('common.approval'),
          value: "8"
        }, {
          label: this.$t('common.refuse'),
          value: "9"
        }],
      echartsLoading: false,
      currObj: {},
    }
  },
  watch: {
    'ruleForm.recipeId' (newVal, oldVal) {
      this.recipeName = this.formulaDstList.find(ii => { return ii.fid == this.ruleForm.recipeId }).recipeName
      this.versionList = this.formulaList.filter(ii => { return ii.recipeName == this.recipeName })
    }
  },
  created () {
    this.getTbrecipeList()
    this.workOrderList()
    this.getWordList()
  },
  methods: {
    //获取配方名称列表
    getTbrecipeList () {
      const param = {
        recipeName: this.keyword,
        isRecipeStatus: [3, 6],
        page: this.formulaPage.pageNum,
        size: this.formulaPage.pageSize,
      }
      this.selectLoading = true
      scheduling.getTbrecipeList(param).then(res => {
        this.selectLoading = false
        if (res.code == 200) {
          this.formulaList = [...this.formulaList, ...res.data.rows]
          this.formulaList = this.$util.RemoveArr(this.formulaList, 'fid')

          let obj = {};
          this.formulaDstList = this.formulaList.reduce((cur, next) => {
            obj[next.recipeName] ? "" : obj[next.recipeName] = true && cur.push(next);
            return cur;
          }, [])
        }
      })
    },
    workOrderList () {
      let startTime = ""
      let endTime = ""
      if (this.formData.time && this.formData.time.length > 0) {
        startTime = this.$util.format(this.formData.time[0], 'YYYY-MM-DD')
      }
      if (this.formData.time && this.formData.time.length > 0) {
        endTime = this.$util.format(this.formData.time[1], 'YYYY-MM-DD')
      }
      const param = {
        page: this.pager.pageNum,
        size: this.pager.pageSize,
        woId: this.formData.keyword,
        stateCd: '',
        startTime: startTime,
        endTime: endTime,
        field: this.pager.field,
        order: this.pager.order,
        stateCds: this.formData.status
      }
      this.tableLoading = true
      scheduling.workOrderList(param).then(res => {
        this.tableLoading = false
        if (res.code == 200) {
          this.tableData = res.data.rows
          this.pager.total = res.data.total
        }
      }).catch(e => {
        this.tableLoading = false
      })
    },
    sortChange (column) {
      if (column.order === 'descending') {
        this.pager.field = column.prop
        this.pager.order = 'DESC'
      } else {
        this.pager.field = column.prop
        this.pager.order = 'ASC'
      }
      this.pager.pageNum = 1
      this.workOrderList()
    },
    handleSearch () {
      this.pager.pageNum = 1
      this.workOrderList()
      this.getWordList()
    },
    loadMoreFun () {
      this.formulaPage.pageNum++
      this.getTbrecipeList()
    },
    //远程搜索配方名称
    remoteMethod (keyword) {
      this.keyword = keyword.trim();
      this.formulaPage.pageNum = 1
      setTimeout(() => {
        this.formulaList = []
        this.getTbrecipeList()
      }, 200)
    },
    handleAdd () {
      this.title = "新增"
      this.ruleForm = {}
      try {
        this.$refs['ruleForm'].resetFields();
      } catch (e) { }

      this.isShowDialog = true
    },
    changePattern () {
      this.isCard = !this.isCard
      this.secle = ''
      this.icon = this.isCard ? 'icon-qiehuan' : 'icon-biaoge'
    },
    handleEdit (row) {
      this.secle = row.radioId
      this.disabled = row.row.stateCd
      this.currObj = row.row
      console.log(row.row)
    },
    modifyRow () {
      if (this.secle === '') {
        this.$message.error('请选择要修改的信息');
        return
      }
      let row = this.tableData.find(item => item.woId == this.secle)
      const index = this.formulaList.findIndex(el => el.fid == row.tbRecipeVo.fid)
      if (index == -1) {
        this.formulaList.push({
          recipeName: row.tbRecipeVo.recipeName,
          fid: row.tbRecipeVo.fid
        })
      }
      let curRecipe
      for (let i = 0; i < this.formulaDstList.length; i++) {
        if (row.tbRecipeVo.recipeName == this.formulaDstList[i].recipeName) {
          curRecipe = this.formulaDstList[i]
          break
        }
      }


      this.ruleForm = Object.assign({}, {
        recipeId: curRecipe.fid, //row.tbRecipeVo.fid,//
        woId: row.woId,
        lotNum: row.lotNum,
        poNum: row.poNum,
        planTime: row.planStartTime ? [new Date(row.planStartTime), new Date(row.planEndTime)] : [],
        stateCd: row.stateCd,
        itemQty: row.tbRecipeVo.itemQty,
        item: row.tbRecipeVo.item,
        uomId: row.tbRecipeVo.uomId,
        type: row.type + '',
        version: row.tbRecipeVo.version,
      })
      this.title = "编辑"
      this.isShowDialog = true
    },
    handleSizeChange (val) {
      this.pager.pageNum = 1
      this.pager.pageSize = val
      this.workOrderList()
    },
    handleCurrentChange (val) {
      this.pager.pageNum = val;
      this.workOrderList()
    },
    handleAddFormula (formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let param = Object.assign({}, this.ruleForm)
          if (this.ruleForm.planTime && this.ruleForm.planTime.length > 0) {
            param.planStartTime = this.$util.format(this.ruleForm.planTime[0])
            param.planEndTime = this.$util.format(this.ruleForm.planTime[1])
          }
          param.tbRecipeVo = {
            fid: ""
          }
          param.version = this.ruleForm.version1
          param.tbRecipeVo.fid = this.recipeId
          delete param.planTime
          this.loading = true
          scheduling.addWorkOrder(param, this.title).then(res => {
            this.loading = false
            this.isShowDialog = false
            if (res.code == 200) {
              this.isShowDialog = false
              // this.ruleForm = {}
              // this.disabled = param.stateCd
              const el = this.tableData.find(item => item.woId == this.secle)
              if (el) {
                this.disabled = el.stateCd
              } else {
                this.disabled = -1
              }
              this.workOrderList()
              this.getWordList()
              this.addAapprove()
              this.$message({ duration: 1000, type: 'success', message: '保存成功!' });
            } else {
              this.$message.error(res.msg);
            }
          }).catch(e => {
            this.isShowDialog = false
            this.loading = false
          })
        } else {
          console.log('error submit!!');
          return false;
        }
      })
    },
    //下发撤回
    handleIssueRecall (status) {
      let txt = status == 1 ? '下发' : '撤回'
      if (this.secle === '') {
        this.$message.error(`请选择要${txt}的数据`);
        return
      }
      let that = this
      this.$customConfirm({
        content: '是否要' + txt + '工单' + this.currObj.woId,
        onok () {
          let row = that.tableData.find(item => item.woId == that.secle)
          const param = {
            stateCd: status,
            woId: row.woId
          }
          scheduling.modifyStatus(param).then(res => {
            if (res.code == 200) {
              that.workOrderList()
              that.getWordList()
              that.disabled = status
              that.$message({ duration: 1000, type: 'success', message: txt + '成功!' });
            } else {
              that.$message.error(res.msg);
            }
          })
        }
      });
    },
    //删除工单
    handleDelete () {
      if (this.secle === '') {
        this.$message.error('请选择要删除的数据');
        return
      }
      let row = this.tableData.find(item => item.woId == this.secle)
      let that = this
      this.$customConfirm({
        content: "请确认是否删除工单" + this.currObj.woId,
        onok () {
          scheduling.removeWorkOrder(row.woId).then(res => {
            if (res.code == 200) {
              that.workOrderList()
              that.getWordList()
              that.ruleForm = {}
              that.secle = ''
              that.disabled = -1
              that.$message({ duration: 1000, type: 'success', message: '删除成功!' });
            }
          })
        }
      });
    },


    handleClose () {
      this.isShowDialog = false
    },
    workOrderJudge () {
      let wo = this.ruleForm.woId
      this.ruleForm.woId = this.ruleForm.woId.replace(/[\u4E00-\u9FA5]/g, '')
      if (wo.length > this.ruleForm.woId.length) this.$message({ duration: 1000, type: 'error', message: '请输入英文或数字!' });
    },
    changeVersion (val) {
      let curRecipe = this.formulaList.find(ii => { return ii.recipeName == this.recipeName && ii.version == this.ruleForm.version1 })
      this.recipeId = curRecipe.fid
    },
    changeRecipeId (val) {
      let item = this.formulaList.find(item => item.fid == val)
      this.ruleForm.itemQty = item.itemQty
      this.ruleForm.item = item.item
      this.ruleForm.uomId = item.uomId
      this.ruleForm.type = item.recipeStatus == 3 ? '1' : item.recipeStatus == 6 ? '2' : ''
      this.ruleForm.version = ''

    },
    //获取全部数据
    getWordList () {
      let startTime = ""
      let endTime = ""
      if (this.formData.time && this.formData.time.length > 0) {
        startTime = this.$util.format(this.formData.time[0], 'YYYY-MM-DD')
      }
      if (this.formData.time && this.formData.time.length > 0) {
        endTime = this.$util.format(this.formData.time[1], 'YYYY-MM-DD')
      }
      const param = {
        woId: this.formData.keyword,
        stateCd: '',
        stateCds: this.formData.status,
        startTime: startTime,
        endTime: endTime,
        isPageable: 1
      }
      this.echartsLoading = true
      scheduling.workOrderList(param).then(res => {
        this.echartsLoading = false
        if (res.code == 200) {
          let xAxisData = []
          let data = []
          let annularData = []
          let obj = {
            stateCd0: 0,
            stateCd1: 0,
            stateCd2: 0,
            stateCd3: 0,
            stateCd4: 0,
            stateCd5: 0,
            stateCd7: 0,
            stateCd8: 0,
            stateCd9: 0
          }
          res.data.rows.forEach(item => {
            xAxisData.push(item.woId)
            item.tbRecipeVo = item.tbRecipeVo ? item.tbRecipeVo : {}
            data.push({
              value: item.tbRecipeVo.itemQty || 0,
              itemStyle: {
                color: this.getColor(item.stateCd)
              },
              woId: item.woId
            })
            if (item.stateCd == 0) {
              obj["stateCd0"]++
            } else if (item.stateCd == 1) {
              obj["stateCd1"]++
            } else if (item.stateCd == 2) {
              obj["stateCd2"]++
            } else if (item.stateCd == 3 || item.stateCd == 6) {
              obj["stateCd3"]++
            } else if (item.stateCd == 4) {
              obj["stateCd4"]++
            } else if (item.stateCd == 5) {
              obj["stateCd5"]++
            } else if (item.stateCd == 7) {
              obj["stateCd7"]++
            } else if (item.stateCd == 8) {
              obj["stateCd8"]++
            } else if (item.stateCd == 9) {
              obj["stateCd9"]++
            }
          })

          for (let key in obj) {
            annularData.push({
              value: res.data.rows.length == 0 ? 0 : (obj[key] / res.data.rows.length * 100).toFixed(2),
              name: this.queryStatus(parseInt(key.charAt(key.length - 1))),
              itemStyle: {
                color: this.getColor(parseInt(key.charAt(key.length - 1)))
              },
            })
          }
          this.$nextTick(() => {
            this.myCharts(xAxisData, data)
            this.myCharts1(annularData)
          })

        }
      }).catch(e => {
        this.echartsLoading = false
      })
    },
    myCharts (xAxisData, data) {
      var dom = this.$refs.columnar;
      var myChart = this.$echarts.init(dom);
      if (columnarEcharts(xAxisData, data) && typeof columnarEcharts(xAxisData, data) === "object") {
        myChart.setOption(columnarEcharts(xAxisData, data, this.$t('recipe.quantity_statistics')), true);
      }
      this.echartsResize(dom)
    },
    myCharts1 (annularData) {
      var dom = this.$refs.annular;
      var myChart = this.$echarts.init(dom);
      if (annularEchar(annularData) && typeof annularEchar(annularData) === "object") {
        myChart.setOption(annularEchar(annularData, this.$t('recipe.status_statistics')), true);
      }
      this.echartsResize(dom)
    },
    echartsResize (doc) {
      let sizeFun = () => {
        this.$echarts.init(doc).resize()
      }
      setTimeout(() => {
        window.addEventListener('resize', sizeFun)
      }, 100)
    },

    getColor (type) {
      switch (type) {
        case 0:
          return '#00CC99'
        // return "新建"
        case 1:
          return '#2E75B5'
        // return this.$t('workorder.release')
        case 2:
          return '#0AFF0A'
        // return this.$t('workorder.function')
        case 3:
        case 6:
          return '#D8D8D8'
        // return this.$t('workorder.finish') 
        case 4:
          return '#FF0000'
        // return this.$t('workorder.suspend')
        case 5:
          return '#FFFF00'
        // return this.$t('common.abandoned')
        case 7:
          return ''
        case 8:
          return '#9966FF'
        //批准
        case 9:
          return '#FF9900'
        // return this.$t('common.refuse')    
      }
    },
    queryStatus (type) {
      switch (type) {
        case 0:
          return this.$t('workorder.newly_build')
        case 1:
          return this.$t('workorder.release')
        case 2:
          return this.$t('workorder.function')
        case 3:
        case 6:
          return this.$t('workorder.finish')
        case 4:
          return this.$t('workorder.suspend')
        case 5:
          return this.$t('common.abandoned')
        case 7:
          return this.$t('common.examine')
        case 8:
          return this.$t('common.approval')
        case 9:
          return this.$t('common.refuse')
      }
    },
    exportpic (val, type) {
      let myChart = this.$echarts.init(document.getElementById(val));
      let picInfo = myChart.getDataURL({
        type: 'png',
        pixelRatio: 1.5,  //放大两倍下载，之后压缩到同等大小展示。解决生成图片在移动端模糊问题
        backgroundColor: '#fff'
      });//获取到的是一串base64信息

      const elink = document.createElement('a');
      elink.download = type + '统计图';
      elink.style.display = 'none';
      elink.href = picInfo;
      document.body.appendChild(elink);
      elink.click();
      URL.revokeObjectURL(elink.href); // 释放URL 对象
      document.body.removeChild(elink)
    },
    //添加审批记录
    addAapprove () {
      const param = {
        woId: this.ruleForm.woId,
        stateCd: '',
        actStartTimeUtc: '',
        woApproveLogVos: [{
          woId: this.ruleForm.woId
        }, {
          woId: this.ruleForm.woId
        }, {
          woId: this.ruleForm.woId
        }, {
          woId: this.ruleForm.woId
        }]
      }
      approvehttp.woApproveLogAdd(param).then(res => {

      })
    },
  }
}
</script>

<style scoped>
.btngroup {
  float: right;
  margin-right: 20px;
}
.change >>> .iconfont {
  font-size: 13px !important;
}
.pagination-area {
  text-align: right;
  padding-top: 20px;
  padding-bottom: 10px;
}
.isShowDialog >>> .el-select,
.isShowDialog >>> .el-date-editor {
  width: 100%;
}
.isShowDialog >>> .el-date-editor .el-range-separator {
  width: 8%;
}
.titmepicker >>> .el-date-editor {
  width: 100%;
}
.titmepicker >>> .el-date-editor .el-range-separator {
  width: 8%;
}
@media only screen and (max-width: 768px) {
  .titmepicker {
    display: none;
  }
}
.dataContent {
  /* height: calc(100vh - 180px); */
  border: 1px solid #ebeef5;
  overflow: auto;
}
.marginLing >>> .el-row {
  margin-left: 0px !important;
  margin-right: 0px !important;
}
</style>